import { Graph } from '@antv/x6';
import { registerNodes } from '../../cells';
import { registerEvents } from '../../common/events';
import { registerShortcuts } from '../../common/shortcuts';
import { registerConnector } from '../../common/connector';
import { registerRouter } from '../../common/router';
import { registerAnchor } from '../../common/anchor';
import { registerEdge } from '../../common/edge';
import { history } from '../../hooks/useHistory';
import { setModel } from '../../hooks/useModel';
import Chain from '../../model/chain';
import { forceLayout } from '../../common/layout';

export default function createFlowGraph(container) {
  // 注册节点
  registerNodes();
  
  // 创建图实例
  const graph = new Graph({
    container,
    grid: {
      visible: true,
      type: 'dot',
      size: 10,
      color: '#cccccc',
      thickness: 1,
    },
    background: {
      color: '#ffffff',
    },
    mousewheel: {
      enabled: true,
      modifiers: ['ctrl', 'meta'],
    },
    connecting: {
      snap: true,
      allowBlank: false,
      allowLoop: false,
      highlight: true,
      connector: 'smooth',
      connectionPoint: 'boundary',
      anchor: 'center',
      validateConnection: ({ sourceView, targetView, sourceMagnet, targetMagnet }) => {
        if (!sourceMagnet || !targetMagnet) {
          return false;
        }
        return true;
      },
    },
    highlighting: {
      magnetAvailable: {
        name: 'stroke',
        args: {
          padding: 4,
          attrs: {
            strokeWidth: 4,
            stroke: '#52c41a',
          },
        },
      },
    },
    interacting: {
      nodeMovable: true,
      edgeMovable: false,
      edgeLabelMovable: false,
      magnetConnectable: true,
      magnetAdsorbed: true,
    },
    scaling: {
      min: 0.1,
      max: 3,
    },
    translating: {
      restrict: true,
    },
    embedding: {
      enabled: true,
      findParent: ({ x, y }) => {
        const cells = graph.getCells();
        return cells.find(cell => {
          if (cell.isNode()) {
            const bbox = cell.getBBox();
            return bbox.containsPoint(x, y);
          }
          return false;
        });
      },
    },
    selecting: {
      enabled: true,
      multiple: true,
      rubberband: true,
      movable: true,
      showNodeSelectionBox: true,
    },
    keyboard: {
      enabled: true,
    },
    clipboard: {
      enabled: true,
    },
    history: {
      enabled: true,
    },
    snapline: {
      enabled: true,
    },
    scroller: {
      enabled: true,
      pageVisible: true,
      pageBreak: false,
      pannable: true,
    },
    minimap: {
      enabled: true,
      container: document.querySelector('.liteflow-editor-mini-map'),
      width: 200,
      height: 150,
      padding: 10,
    },
  });

  // 注册事件
  registerEvents(graph);
  
  // 注册快捷键
  registerShortcuts(graph);
  
  // 注册连接器
  registerConnector(graph);
  
  // 注册路由
  registerRouter(graph);
  
  // 注册锚点
  registerAnchor(graph);
  
  // 注册边
  registerEdge(graph);
  
  // 初始化历史记录
  history.init(graph);
  
  // 初始化模型
  const chain = Chain.create();
  setModel(chain);
  
  // 监听模型变化
  graph.on('model:change', () => {
    const model = chain;
    const cells = model.toCells();
    graph.resetCells(cells);
    forceLayout(graph);
  });
  
  // 监听节点变化
  graph.on('cell:changed', () => {
    // 这里可以添加节点变化时的处理逻辑
  });
  
  // 监听选择变化
  graph.on('selection:changed', ({ selected, added, removed }) => {
    // 这里可以添加选择变化时的处理逻辑
  });
  
  return graph;
} 